<template>
  <div>
    <el-dialog title="风险预警" class="authentication-wrapper" :visible.sync="authenticationVisible" append-to-body width="650px" :before-close="beforeClose">
      <el-divider style="margin: 0 0 0 0"></el-divider>
      <div style="margin-top: 1%; height: 60px; border: 1px solid #b2d6ff; background-color: #ebf5ff; line-height: 27px; padding-top: 3px">
        <span style="margin-left: 2%; font-size: 13px">
          <i class="el-icon-warning" style="color: #1890ff; font-size: small"></i>
          <span style="margin-left: 7px"> 发票开具环节风险预警提示 </span><br />
          <span style="margin-left: 2%; font-size: 13px"> 您的发票开具触发了风险监控预警，需要当前登录人完成身份验证！请按照指引完成身份认证处理。 </span>
        </span>
      </div>
      <div style="text-align: center; margin-top: 15px">
        <p>请使用电子税务app扫描二维码进行身份认证</p>
        <div>
          <img :src="imgSrc" />
        </div>
        <el-button @click="buildQRCodeMethod">
          <i class="el-icon-refresh" style="font-size: 15px; cursor: pointer; font-weight: 600" @click="refresh()"></i>
          刷新二维码
        </el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import { buildQRCode, checkAuthStatus } from '@/api/output/batchIssue.js'
export default {
  data() {
    return {
      authenticationVisible: false,
      imgSrc: '',
      rzid: '',
      timer: '',
    }
  },
  methods: {
    // 生成认证二维码
    buildQRCodeMethod() {
      buildQRCode().then((res) => {
        if (res.code == 0) {
          console.log('二维码', res)
          let blob = this.dataURLtoimgBlob(res.data.ewmByte)
          let url = window.URL.createObjectURL(blob)
          this.imgSrc = url
          this.rzid = res.data.rzid
          this.checkAuthStatusMethod()
        } else if (res.code != 0) {
          this.$message({
            message: res.message,
            type: 'error',
          })
        }
      }).catch((error) => {
        this.$message({
          message: error,
          type: 'error',
        })
      })
    },
    dataURLtoimgBlob(dataURI) {
      var byteString = window.atob(dataURI) //base64 解码
      var arrayBuffer = new ArrayBuffer(byteString.length) //创建缓冲数组
      var intArray = new Uint8Array(arrayBuffer) //创建视图
      for (var i = 0; i < byteString.length; i++) {
        intArray[i] = byteString.charCodeAt(i)
      }
      return new Blob([intArray], { type: 'image/png' })
    },
    checkAuthStatusMethod() {
      let param = {
        rzid: this.rzid,
      }
      checkAuthStatus(param).then((res) => {
        if (res.code == 0) {
          if (this.authenticationVisible == false) {
            // alert('弹框关闭,已取消实人认证')
            this.$message({
              message: '实人认证已取消！',
              type: 'warning',
            })
          } else {
            if (res.data == '认证通过') {
              this.$message({
                message: '实人认证成功，请重新开票！',
                type: 'success',
              })
              this.authenticationVisible = false
            } else if (res.data == '还未扫码') {
              setTimeout(() => {
                this.checkAuthStatusMethod()
              }, 3000)
            } else if (res.data == '二维码过期') {
              console.log('二维码过期')
              this.$message({
                message: '二维码已刷新，请重新扫码认证！',
                type: 'warning',
              })

              this.buildQRCodeMethod()
            }
          }
        } else if (res.code != 0) {
          this.$message({
            message: res.message,
            type: 'error',
          })
          return
        }
      }).catch((error) => {
        this.$message({
          message: error,
          type: 'error',
        })
      })
    },

    // 获取认证状态
    beforeClose() {
      this.authenticationVisible = false
    },
  },
  created() {
  },
}
</script>
  <style scoped>
.authentication-wrapper /deep/ .el-dialog__body {
  padding: 0px 20px 30px 20px !important;
}
.authentication-wrapper /deep/ .el-divider--horizontal {
  margin: 5px 0px 15px 0px !important;
}
</style>